Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

302
Vistas
Headings extraction in JS - "If" works but "Else" doesn't

I'm trying to run this code and extract all headings with the option to show "doesn't exist" when certain headings well... doesn't exist, but it's not reading the else statement somehow and would be great if you could point me to the right direction.

function headingsEx() {
    let h = ["h1", "h2", "h3", "h4", "h5", "h6"];
    for (let i of h) {
        if (document.getElementsByTagName(i)) {
            let foundHs = document.querySelectorAll(i)
            for (let c of foundHs) {
                console.log({ [i]: c.textContent })
            };
        } else {
            console.log([i] + " doesn't exist");
        }
    }
}

headingsEx();
about 4 years ago · Juan Pablo Isaza
3 Respuestas
Responde la pregunta

0

An empty array is truthy (usually anyway) so even when getElementsByTagName(i) finds nothing and returns an empty array, the "then" block is still the one that gets executed.

console.log('is [] true?');
if ([]) {
  console.log('yes');
} else {
  console.log('no');
}

console.log('---');

console.log('is [99] true?');
if ([99]) {
  console.log('yes');
} else {
  console.log('no');
}

If you're wondering why I said "usually", see https://xavierchow.github.io/2015/12/15/js-coercion/ but don't worry if you can't follow it. It was news to me as well.

about 4 years ago · Juan Pablo Isaza Denunciar

0

According to the docs, document.getElementsByTagName(i) returns a live HTMLCollection. No where in the docs does it say it returns anything other than that. So it is safe to say that document.getElementsByTagName(i) will always be truthy (i.e. not null or false). You can instead check the length member. It will be greater than 0 if at least one of the element exists.

function headingsEx() {
    let h = ["h1", "h2", "h3", "h4", "h5", "h6"];
    for (let i of h) {
        if (document.getElementsByTagName(i).length) {
            let foundHs = document.querySelectorAll(i)
            for (let c of foundHs) {
                console.log({ [i]: c.textContent })
            };
        } else {
            console.log([i] + " doesn't exist");
        }
    }
}

headingsEx();
about 4 years ago · Juan Pablo Isaza Denunciar

0

Since you asked about alternative approaches:

This example grabs all the heading elements using querySelectorAll, and then uses map to create a new array of node names. You can then iterate over the headings array and check to see if each element is included in the nodeNames array, and then log the result accordingly.

const arr = ['h1', 'h2', 'h3', 'h4', 'h5', 'h6'];
const headings = document.querySelectorAll(arr.join(','));

const nodeNames = [...headings].map(heading => {
  return heading.nodeName.toLowerCase();
});

arr.forEach(el => {
  if (nodeNames.includes(el)) {
    console.log(`${el}: exists.`)
  } else {
    console.log(`${el}: does not exist.`)
  }
});
<h1>Hi</h1>
<h3>Hi</h3>
<h4>Hi</h4>
<h6>Hi</h6>

about 4 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda